import { createBrowserRouter, RouteObject } from 'react-router-dom';

import Home from '../Home';
import Login from '../Login';
import Registry from '../Registry';
import NotFound from '../NotFound';
import List from '../manage/List';
import Star from '../manage/Star';
import Trash from '../manage/Trash';
import QuestionLayout from '../../layout/QuestionLayout';
import ManagerLayout from '../../layout/ManagerLayout';
import MainLayout from '../../layout/MainLayout';
import { lazy } from 'react';
// import Editor from '../question/editor';

const Editor = lazy(() => import('../question/editor'));

// /manager + list
const manage: RouteObject[] = [
  { path: 'list', element: <List /> },
  { path: 'star', element: <Star /> },
  { path: 'trash', element: <Trash /> },
];

// / + login
const main: RouteObject[] = [
  { path: '/', element: <Home /> },
  { path: 'login', element: <Login /> },
  { path: 'register', element: <Registry /> },
  { path: 'manager', element: <ManagerLayout />, children: manage },
];

const question: RouteObject[] = [
  { path: 'edit/:id', element: <Editor /> },
  { path: 'stat/:id', element: <Star /> },
];

export const router = createBrowserRouter([
  { path: '/', element: <MainLayout />, children: main },
  { path: 'question', element: <QuestionLayout />, children: question },
  { path: '*', element: <NotFound /> },
]);
